<template>
  <div class="describe acea-row row-center-wrapper" v-show="decInfo">
    <div class="window">
      <span class="dec_text">{{ detail }}</span>
    </div>
  </div>
</template>

<script>
export default {
  name: "couponDecWindow",
  props: {
    decInfo: {
      type: Boolean,
      default: false
    },
    detail: {
      type: String,
      default: ""
    }
  }
};
</script>
<style lang="scss" scoped>
.describe {
  width: 3.36rem;
  height: 2.14rem;
  background: url("../assets/images/coupon/describe_window.png") 0 0 no-repeat;
  background-size: 100% 100%;
  padding: 0.4rem 0.3rem;
  box-sizing: border-box;
  position: absolute;
  z-index: 99;
  left: 50%;
  bottom: -2rem;
  transform: translate(-35%, 0);
  .window {
    width: 100%;
    height: 100%;
    max-height: 100%;
    overflow: auto;
    text-align: left;
    .dec_text {
      font-size: 0.22rem;
      font-weight: 400;
      color: rgba(0, 0, 0, 0.5);
      line-height: 0.32rem;
    }
  }
}
</style>
